<!DOCTYPE html>
<html lang="en">
    <head>
		<meta charset="GB2312" />
        <meta http-equiv="X-UA-Compatible" content1="IE=edge,chrome=1"> 
        <title>昌吉调查6-10</title>
        <meta name="viewport" content1="width=device-width, initial-scale=1.0"> 
        <meta name="description" content1="Animated content1 tab1s with CSS3" />
        <meta name="keywords" content1="tab1s, css3, transition, checked, pseudo-class, label, css-only, sibling combinator" />
        <link rel="stylesheet" type="text/css" href="css/demo.css" />
        <link rel="stylesheet" type="text/css" href="css/style2.css" />
        <link rel="stylesheet" type="text/css" href="css/common.css" />
		<script type="text/javascript" src="js/modernizr.custom.04022.js"></script>
		<script type="text/javascript" src="js/jquery-1.6.min.js"></script>
		<!--[if lt IE 9]>
			<style>
				.content1{
					height: auto;
					margin: 0;
				}
				.content1 div {
					position: relative;
				}
			</style>
		<![endif]-->
    </head>
    <body onload="">
        <div class="container">
			<section class="tab1s1">
	            <input id="tab1-1" type="radio" onchange="showContentPage(this)" hidden name="radio-set1" class="tab1-selector-1" />
		        <label for="tab1-1" class="tab1-label-1">500-600</label>
		
	            <input id="tab1-2" type="radio" onchange="showContentPage(this)" hidden name="radio-set1" class="tab1-selector-2" />
		        <label for="tab1-2" class="tab1-label-2">600-700</label>
		
	            <input id="tab1-3" type="radio" onchange="showContentPage(this)" hidden name="radio-set1" class="tab1-selector-3" />
		        <label for="tab1-3" class="tab1-label-3">700-800</label>
			
	            <input id="tab1-4" type="radio" onchange="showContentPage(this)" hidden name="radio-set1" class="tab1-selector-4" />
		        <label for="tab1-4" class="tab1-label-4">800-900</label>
		        
		        <input id="tab1-5" type="radio" onchange="showContentPage(this)" hidden name="radio-set1" class="tab1-selector-5" />
		        <label for="tab1-5" class="tab1-label-5">900-000</label>
            
			    <div class="clear-shadow"></div>
			
		        <div class="content1">
			        <div class="content1-1" style="display: none">
						    <table
								bordercolor="#339999" bgcolor="#DBDBDB"  id="gridtable_6" class="gridtable">
							</table>
				    </div>
			        <div class="content1-2" style="display: none">
	                        <table
								bordercolor="#339999" bgcolor="#DBDBDB"  id="gridtable_7" class="gridtable">
							</table>					      	
				    </div>
			        <div class="content1-3" style="display: none">
						 <table
								bordercolor="#339999" bgcolor="#DBDBDB"  id="gridtable_8" class="gridtable">
							</table>
				    </div>
				    <div class="content1-4" style="display: none">
						 <table
								bordercolor="#339999" bgcolor="#DBDBDB"  id="gridtable_9" class="gridtable">
							</table>
				    </div>
				    <div class="content1-5" style="display: none">
                       <table
								bordercolor="#339999" bgcolor="#DBDBDB"  id="gridtable_10" class="gridtable">
							</table>
				    </div>
		        </div>
			</section>
        </div>
       
    </body>
</html>
<script type="text/javascript">
function showContentPage(ele) {
    showContentIndex($(ele).index()/2);
}
function showContentIndex(index){
    var content=$('.content1').children();
    for(var i= 0;i< content.length;i++){
        var item= content.eq(i);
        if(i==index){
            item.css("display","block");
        }else{
            item.css("display","none");
        }
    }
}
function showFirstPage(){
    var lab=$(".tab1s1 label");
    for(var i= 0;i< lab.length;i++){
        var dis=lab.eq(i).css("display");
        if(dis!="none"){
            showContentIndex(i);
            break;
        }
    }
    var check=$(".tab1s1 input[type='radio']");
    for(var j=0;j<check.length;j++){
        if(j==i){
            check.eq(j).attr("checked",'checked');
        }else{
            check.eq(j).removeAttr("checked");
        }
    }
}
function getData(){
    var radios=$("input[type=radio]");
    for(var i in radios){
        if(radios[i].checked)
            break;
    }

    var vals=[];
    $('.content1').children().eq(i).find("input").each(function(){
        if(this.getAttribute("type")=="hidden"){
            var obj={};
            obj[this.getAttribute("name")]=this.value;
            vals.push(obj);
        }else{
            var item=vals[vals.length-1];
            item[this.getAttribute("name")]=this.value;
        }
        return true;
    });

    window.android.onDataUpdate(JSON.stringify(vals),$('.tab1s1 label').eq(i).text());
}
function initStartTab(index){
    var lab=$(".tab1s1 label");
    for(var i= 0;i< index;i++){
        lab.eq(i).css("display","none");
    }
}
function initEndTab(index){
    var lab=$(".tab1s1 label");
    for(var i= lab.length;i> index;i--){
        lab.eq(i).css("display","none");
    }
}
function updateTable(data){
    var result=eval(data);
    var roadType ='沥青路面';//路基，沥青路面，砂石路面，水泥路面，沿线调查
     	var totalColumn=0;//生成表格的总的列数
     	if(roadType=='沥青路面'||roadType=='水泥路面'||roadType=='路基'){
     		totalColumn=7;
         }
        if(roadType=='砂石路面'){
        	totalColumn=3;
         }
        if(roadType=='沿线调查'){
        	totalColumn=5;
         }
     	var currName='';
     	var mapNum = {};//每个细目出现的次数 
     	var numFlag =0;//的次数
     	for(var i=0;i<result.length;i++){
         	if(currName==''){
         		currName=encodeURI((result[i].columnName+result[i].unit).trim());
         		numFlag=1;
         		continue;
             }
            if(currName==encodeURI((result[i].columnName+result[i].unit).trim())){
                numFlag++;
            }else{
                if(numFlag==3||numFlag==2)//出现了三次,二次，每td 占一列
                {
                	mapNum[currName]=1;
                	currName=encodeURI((result[i].columnName+result[i].unit).trim());
                	numFlag=1;
                	continue;
                }
                if(numFlag==1)//出现了三次，每td 占一列
                {
                	mapNum[currName]=totalColumn-2;
                	currName=encodeURI((result[i].columnName+result[i].unit).trim());
                	numFlag=1;
                }
            }
        }
     	if(numFlag==3||numFlag==2)//出现了三次，没td 占一列
        {
        	mapNum[currName]=1;
        }
        if(numFlag==1)//出现了三次，没td 占一列
        {
        	mapNum[currName]=totalColumn-2;
        }
        //生成第六个tab
        function makeupTabSix(){
        	var html="";
            currName='';
        	var flag=0;//当前行的列
         	for(var i=0;i<result.length;i++){//通过判断明细项来确定是不是在同一行展示
             	if(currName==''){
             		currName=(result[i].columnName+result[i].unit).trim();
             		var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
             		var  str='<tr>'
                 		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                 		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                 		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveySix_"'+i+' name="surveySix" value="'+result[i].surveySix+'"></input></td>';
             		flag=3+column-1;
                }else{
                    if(currName==(result[i].columnName+result[i].unit).trim()){
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str='<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveySix_"'+i+' name="surveySix" value="'+result[i].surveySix+'"></input></td>';
                 		flag=flag+2+column-1;
                    }else{
                        var perStr=''
                    	currName=(result[i].columnName+result[i].unit).trim();
                    	if(flag!=totalColumn){
                        	while(flag<totalColumn){
                            	flag++;
                            	perStr=perStr+'<td></td>'
                            }
                        }
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str=perStr+'</tr><tr>'
                     		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                     		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveySix_"'+i+' name="surveySix" value="'+result[i].surveySix+'"></input></td>';
                 		flag=3+column-1;
                    }
                }
         		html=html+str;
         	}
         	var perStr='';
         	if(flag!=totalColumn){
            	while(flag<totalColumn){
                	flag++;
                	perStr=perStr+'<td></td>'
                }
            }
           html=html+perStr;
         	var table = document.getElementById("gridtable_6");
         	table.innerHTML=html;
        }
        //生成第七个tab
        function makeupTabSeven(){
        	var html="";
            currName='';
        	var flag=0;//当前行的列
         	for(var i=0;i<result.length;i++){//通过判断明细项来确定是不是在同一行展示
             	if(currName==''){
             		currName=(result[i].columnName+result[i].unit).trim();
             		var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
             		var  str='<tr>'
                 		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                 		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                 		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveySeven_"'+i+' name="surveySeven" value="'+result[i].surveySeven+'"></input></td>';
             		flag=3+column-1;
                }else{
                    if(currName==(result[i].columnName+result[i].unit).trim()){
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str='<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveySeven_"'+i+' name="surveySeven" value="'+result[i].surveySeven+'"></input></td>';
                 		flag=flag+2+column-1;
                    }else{
                        var perStr=''
                    	currName=(result[i].columnName+result[i].unit).trim();
                    	if(flag!=totalColumn){
                        	while(flag<totalColumn){
                            	flag++;
                            	perStr=perStr+'<td></td>'
                            }
                        }
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str=perStr+'</tr><tr>'
                     		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                     		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveySeven_"'+i+' name="surveySeven" value="'+result[i].surveySeven+'"></input></td>';
                 		flag=3+column-1;
                    }
                }
         		html=html+str;
         	}
         	var perStr=''
         	if(flag!=totalColumn){
            	while(flag<totalColumn){
                	flag++;
                	perStr=perStr+'<td></td>'
                }
            }
           html=html+perStr;
         	var table = document.getElementById("gridtable_7");
         	table.innerHTML=html;
        }
      //生成第八个tab
        function makeupTabEight(){
        	var html="";
            currName='';
        	var flag=0;//当前行的列
         	for(var i=0;i<result.length;i++){//通过判断明细项来确定是不是在同一行展示
             	if(currName==''){
             		currName=(result[i].columnName+result[i].unit).trim();
             		var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
             		var  str='<tr>'
                 		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                 		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                 		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveyEight_"'+i+' name="surveyEight" value="'+result[i].surveyEight+'"></input></td>';
             		flag=3+column-1;
                }else{
                    if(currName==(result[i].columnName+result[i].unit).trim()){
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str='<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveyEight_"'+i+' name="surveyEight" value="'+result[i].surveyEight+'"></input></td>';
                 		flag=flag+2+column-1;
                    }else{
                        var perStr=''
                    	currName=(result[i].columnName+result[i].unit).trim();
                    	if(flag!=totalColumn){
                        	while(flag<totalColumn){
                            	flag++;
                            	perStr=perStr+'<td></td>'
                            }
                        }
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str=perStr+'</tr><tr>'
                     		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                     		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveyEight_"'+i+' name="surveyEight" value="'+result[i].surveyEight+'"></input></td>';
                 		flag=3+column-1;
                    }
                }
         		html=html+str;
         	}
         	var perStr=''
         	if(flag!=totalColumn){
            	while(flag<totalColumn){
                	flag++;
                	perStr=perStr+'<td></td>'
                }
            }
           html=html+perStr;
         	var table = document.getElementById("gridtable_8");
         	table.innerHTML=html;
        }
      //生成第九个tab
        function makeupTabNine(){
        	var html="";
            currName='';
        	var flag=0;//当前行的列
         	for(var i=0;i<result.length;i++){//通过判断明细项来确定是不是在同一行展示
             	if(currName==''){
             		currName=(result[i].columnName+result[i].unit).trim();
             		var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
             		var  str='<tr>'
                 		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                 		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                 		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveyNine_"'+i+' name="surveyNine" value="'+result[i].surveyNine+'"></input></td>';
             		flag=3+column-1;
                }else{
                    if(currName==(result[i].columnName+result[i].unit).trim()){
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str='<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveyNine_"'+i+' name="surveyNine" value="'+result[i].surveyNine+'"></input></td>';
                 		flag=flag+2+column-1;
                    }else{
                        var perStr=''
                    	currName=(result[i].columnName+result[i].unit).trim();
                    	if(flag!=totalColumn){
                        	while(flag<totalColumn){
                            	flag++;
                            	perStr=perStr+'<td></td>'
                            }
                        }
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str=perStr+'</tr><tr>'
                     		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                     		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveyNine_"'+i+' name="surveyNine" value="'+result[i].surveyNine+'"></input></td>';
                 		flag=3+column-1;
                    }
                }
         		html=html+str;
         	}
         	var perStr=''
         	if(flag!=totalColumn){
            	while(flag<totalColumn){
                	flag++;
                	perStr=perStr+'<td></td>'
                }
            }
           html=html+perStr;
         	var table = document.getElementById("gridtable_9");
         	table.innerHTML=html;
        }
      //生成第十个tab
        function makeupTabTen(){
        	var html="";
            currName='';
        	var flag=0;//当前行的列
         	for(var i=0;i<result.length;i++){//通过判断明细项来确定是不是在同一行展示
             	if(currName==''){
             		currName=(result[i].columnName+result[i].unit).trim();
             		var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
             		var  str='<tr>'
                 		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                 		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                 		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveyTen_"'+i+' name="surveyTen" value="'+result[i].surveyTen+'"></input></td>';
             		flag=3+column-1;
                }else{
                    if(currName==(result[i].columnName+result[i].unit).trim()){
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str='<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%"  align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveyTen_"'+i+' name="surveyTen" value="'+result[i].surveyTen+'"></input></td>';
                 		flag=flag+2+column-1;
                    }else{
                        var perStr=''
                    	currName=(result[i].columnName+result[i].unit).trim();
                    	if(flag!=totalColumn){
                        	while(flag<totalColumn){
                            	flag++;
                            	perStr=perStr+'<td></td>'
                            }
                        }
                    	var column=mapNum[encodeURI((result[i].columnName+result[i].unit).trim())];
                    	var  str=perStr+'</tr><tr>'
                     		+'<td width="16%" align="center" class="textItem">'+result[i].columnName+'</td>'
                     		+'<td width="12%" align="center" class="textItem">'+result[i].nickName+'('+result[i].unit+')</td>'
                     		+'<td width="12%" align="left" colspan='+column+'><input type="hidden" name="id" id="id_'+i+'" value="'+result[i].iD+'"/><input type="text" class="textInput" onfocus="inputfocus(this);" onblur="inputblur(this);"  id="surveyTen_"'+i+' name="surveyTen" value="'+result[i].surveyTen+'"></input></td>';
                 		flag=3+column-1;
                    }
                }
         		html=html+str;
         	}
         	var perStr=''
         	if(flag!=totalColumn){
            	while(flag<totalColumn){
                	flag++;
                	perStr=perStr+'<td></td>'
                }
            }
           html=html+perStr;
         	var table = document.getElementById("gridtable_10"); 
         	table.innerHTML=html;
        }
        makeupTabSix();
        makeupTabSeven();
        makeupTabEight();
        makeupTabNine();
        makeupTabTen();
};
function inputfocus(obj){
		obj.value=obj.value+'+';
	}
	function inputblur(obj){
		var itemValue=obj.value.split('+');
		var sum=0;
		for(var i=0;i<itemValue.length;i++){
			var val=0;
			if(itemValue[i]!=0){
				val=parseFloat(itemValue[i]);
			}
			if(isNaN(val)){
				alert('输入的非数值，请重新输入！');
				obj.value=0;
				return;
			}else{
				if(val.length!=0){
					sum=sum+val;
				}
			}
		}
		obj.value=sum;
	}

</script>